<template>
	<view class="tail-info">
		<view class="c-row-box">
			<view class="c-row-head">
				<view class="c-row-title">尾款收款</view>
			</view>
			<view class="c-row-item">
				<view class="c-row c-row-list">
					<view class="c-row-col c-row-col-list-item">
						<view class="col-title"><text style="color: red;">*</text>收款金额</view>
						<view class="col-text">
							<input type="digit" placeholder="请输入" @input="getMiddleMoney" :disabled="isPreview" v-model="orderParams.tail_money" />
						</view>
					</view>
				</view>
				<view class="c-row c-row-list">
					<view class="c-row-col c-row-col-list-item">
						<view class="col-title"><text style="color: red;">*</text>收款时间</view>
						<view class="col-text">
							<picker mode="date" :start="startDate" :end="endDate" @change="tailDateChange" :disabled="isPreview">
								<view>{{orderParams.tail_money_date == '' ? '请选择' : orderParams.tail_money_date}}</view>
							</picker>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			isPreview: {
				type: Boolean,
				default () {
					return false
				}
			},
			orderParams: {
				type: Object,
				default () {
					return {}
				}
			},
			startDate: {
				type: String,
				default () {
					return ''
				}
			},
			endDate: {
				type: String,
				default () {
					return ''
				}
			}
		},
		data() {
			return {

			};
		},
		methods:{
			// 收款时间
			tailDateChange(e) {
				this.orderParams.tail_money_date = e.target.value;
				console.log(e)
				this.$emit('getTailChange')
			},
			// 自动计算中款
			getMiddleMoney(){
				this.$emit('getMiddleMoney')
			}
		}
	}
</script>

<style lang="less">
	@import url('../../components/common.less');
	@import url('./common.less');
</style>
